<template>
  <div class="mulu">
    <el-form-item label-width="120px" label="目录：" prop="catalogID">
      <el-select
        style="width: 100%"
        v-model="catalogName"
        placeholder="请选择"
        @change="btn"
      >
        <el-option
          v-for="(item, index) in directory"
          :key="index"
          :label="item.directoryName"
          :value="item.id"
        >
        </el-option>
      </el-select>
    </el-form-item>
  </div>
</template>

<script>
import { list } from '@/api/hmmm/directorys.js'
export default {
  name: 'Mulu',
  props: {
    prop: {
      type: Object,
      required: true
    },
    keyID: {
      type: [Number, String]
    }
  },
  data() {
    return {
      directory: [],
      catalogName: ''
    }
  },
  created() {
    this.getLists()
  },
  methods: {
    async getLists() {
      try {
        const { data } = await list(this.keyID)
        // console.log(data)
        this.directory = data.items
      } catch (err) {
        console.log('错误')
      }
    },
    btn() {
      // 传给父组件
      this.$emit('catalogID', this.catalogName)
      // console.log(11)
    }
  }
}
</script>

<style lang="less" scoped></style>
